<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE HTML >
<html>
<head>
    <title>CCRM管理平台</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="${gPath}/img/favicon.png" rel="shortcut icon" type="text/css" />
    <link href="${gPath}/styles/dpl-min.css" rel="stylesheet" type="text/css" />
    <link href="${gPath}/styles/bui-min.css" rel="stylesheet" type="text/css" />
    <link href="${gPath}/styles/main-min.css" rel="stylesheet" type="text/css" />
    <link href="${gPath}/styles/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div class="header">
        <div class="dl-title">
            <a href="#">
              <span class="lp-title-port">CCRM</span><span class="dl-title-text">管理平台</span>
            </a>
        </div>
        <div class="dl-log" style="margin-right: 3%;">
            欢迎您，
            <span class="dl-log-user" id="link">
                <shiro:principal property="name"/>
            </span>
        </div>
    </div>
    <div class="content">
        <div class="dl-main-nav">
            <div class="dl-inform"><div class="dl-inform-title">贴心小秘书<s class="dl-inform-icon dl-up"></s></div></div>
            <ul id="J_Nav"  class="nav-list ks-clear">
                <li class="nav-item dl-selected"><div class="nav-item-inner nav-home">首页</div></li>
            </ul>
        </div>
        <ul id="J_NavContent" class="dl-tab-conten">
        </ul>
    </div>
    <!--表单页-->
    <div id="accountInfoDialog" style="display: none">
      <form id="J_Form" class="form-horizontal span19">
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">账号：</label>
                  <div class="controls">
                      <input name="account.id" id="accountId" type="hidden" class="input-normal control-text">
                      <input name="account.account" id="account" type="text" class="input-normal control-text" disabled>
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">姓名：</label>
                  <div class="controls">
                      <input name="account.name" id="name" type="text"  data-rules="{required:true}"   class="input-normal control-text">
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">角色：</label>
                  <div class="controls" id="roleSelectDiv"></div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">工号：</label>
                  <div class="controls">
                      <input name="account.job_no" id="job_no" type="text"  class="input-normal control-text">
                  </div>
              </div>
          </div><div class="row">
          <div class="control-group span15">
              <label class="control-label">部门：</label>
              <div class="controls">
                  <input name="account.department" id="department" type="text"  class="input-normal control-text">
              </div>
          </div>
      </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">账号类型：</label>
                  <div class="controls">
                      <select name="account.type" id="type" disabled>
                          <option value="0">客服</option>
                          <option value="1">仓储</option>
                          <option value="2">管理员</option>
                      </select>
                  </div>
              </div>
          </div>
          <hr>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">旧密码：</label>
                  <div class="controls">
                      <input name="account.password" id="password" type="password" class="input-normal control-text" >
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">新密码：</label>
                  <div class="controls">
                      <input name="account.newPassword" id="newPassword" type="password" data-rules="{regexp:/^[\@A-Za-z0-9\!\#\$\%\^\&\*\.\~]{6,22}$/,messages:'请输入6到10位数字或字母'}" data-messages="{required:'请输入正确的手机号码'}"  class="input-normal control-text" >
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">重复新密码：</label>
                  <div class="controls">
                      <input id="reNewPassword" type="password" data-rules="{equalTo:'#newPassword'}"  class="input-normal control-text" >
                  </div>
              </div>
          </div>
          <hr>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">手机：</label>
                  <div class="controls">
                      <input name="account.mobile" id="mobile" type="text" data-rules="{regexp:/^1[3|4|5|8][0-9]\d{4,8}$/,messages:'请输入正确的手机号码'}" data-messages="{required:'请输入正确的手机号码'}"  class="input-normal control-text" >
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">邮箱：</label>
                  <div class="controls">
                      <input name="account.email" id="email" type="text" data-rules="{email:true}" data-messages="{required:'请输入正确的邮箱'}"  class="input-normal control-text" >
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="control-group span15">
                  <label class="control-label">备注：</label>
                  <div class="controls control-row4">
                      <textarea name="account.remark" id="remark" class="input-large" data-tip="{text:'请填写备注信息！'}" type="text"></textarea>
                  </div>
              </div>
          </div>
          <div class="row" >
              <div class="span10 is-hide" id="errorMsg">
                  <div class="tips tips-large tips-warning">
                      <span class="x-icon x-icon-error">×</span>
                      <div class="tips-content">
                          <h2 id="errorContent">系统繁忙，请稍后再试</h2>
                      </div>
                  </div>
              </div>
          </div>
          <div class="row " >
              <div class="span10 is-hide" id="successMsg">
                  <div class="tips tips-large tips-success">
                      <span class="x-icon x-icon-success"><i class="icon icon-ok icon-white"></i></span>
                      <div class="tips-content">
                          <h2>更新成功</h2>
                      </div>
                  </div>
              </div>
          </div>
          <div class="row form-actions actions-bar">
              <div class="span13 offset3 ">
                  <button type="button" id="submitBtn" class="button button-primary">保存</button>
              </div>
          </div>
      </form>
    </div>
    <script type="text/javascript" src="${gPath}/scripts/jquery/jquery-1.8.1.min.js"></script>
    <script type="text/javascript" src="${gPath}/scripts/bui.js"></script>
    <script type="text/javascript" src="${gPath}/scripts/config.js"></script>
    <script type="text/javascript" src="${gPath}/scripts/seed.js"></script>
    <script>
    window.account = ${loginedUser};
    var modelFormDialog = new BUI.Overlay.Dialog({
        title: '个人信息',
        width: 800,
        height: 600,
        mask: false,
        buttons: [],
        contentId: 'accountInfoDialog'
    });
    $(function(){
        var menus = ${menus};
        if (menus.length > 0){
            var config = [{
                homePage: menus[0].items[0].id,
                id:'menu',
                menu: menus
            }];
            BUI.use('common/main',function(){
                new PageUtil.MainPage({
                    urlSuffix: ".jsp",
                    modulesConfig: config
                });
            });
        } else {
            alert("没有权限");
        }

        $.getJSON("${gPath}/clmp/account/getRoles", {"accountId": account.account_id}, function(data){
            var roleSelectDiv = $("#roleSelectDiv");
            for (var i = 0; i < data.length; i++)
                roleSelectDiv.append("<input type='checkbox' name='roleIds' value='"+ data[i].id +"' "+ (data[i].checked ? "checked" : "") +" disabled/>"+ data[i].name +"&emsp;");
        });

        $('#accountId').val(account.account_id);
        $('#account').val(account.account);
        $('#name').val(account.name);
        $('#department').val(account.department);
        $('#job_no').val(account.job_no);
        $('#mobile').val(account.mobile);
        $('#email').val(account.email);
        $('#remark').val(account.remark);

        $("#signout").click(function(){
            if(confirm('确定退出?')){
                $.ajax({
                    url:"${gPath}/res/_webApi/signin/signout",
                    type:"get",
                    dataType:"json",
                    success:function(data){
                        if(data.code == 20001){
                            window.location.href="${gPath}/";
                        }
                    },
                    error:function(e){
                        alert("系统繁忙");
                    }
                });
            }
        });
        $("#accountInfo").click(function(){
            modelFormDialog.show();
        });
        $("#submitBtn").click(function(){
            update();
        });

        bindDingDing();
    });

    var infoMenu = new BUI.Menu.PopMenu({
        trigger : '#link',
        autoRender : true,
        triggerEvent : 'mouseenter',
        triggerHideEvent : 'mouseleave',
        autoHideType:'leave',
        width : 80,
        children : [{
            text : "个人信息",
            tpl:'<a id="{id}" ><span>{text}</span></a>',
            id:'accountInfo'
        },{
            id:'signout',
            tpl:'<span id="{id}" title="退出系统" class="dl-log-quit">退出</span>'
        }]
    });

    /**
     * 和钉钉用户绑定
     */
    function bindDingDing(){
        var acc = window.account;
        if (!acc.dingUserId){
            $.getJSON("${gPath}/dingtalk/getMatchUser", function(dingUser){
                if (!$.isEmptyObject(dingUser)){
                    if (confirm("当前用户未绑定钉钉，需要绑定"+ dingUser.name +"("+dingUser.mobile+")吗？")){
                        $.post("${gPath}/dingtalk/bindUser", {dingUserId : dingUser.userid}, function(result){
                            alert(result.status == 1 ? "绑定成功" : result.msg);
                        });
                    }
                }
            });
        }
    }

    function update() {
        var error = $(".error");
        if(error && error.length > 0){
            return;
        }
        $(".is-hide").hide();
        $("#errorContent").html("系统繁忙，请稍后再试");
        var id = $("#accountId").val();
        var data = {};
        data['account.account_id'] = $('#accountId').val();
        data['account.name'] = $('#name').val();
        data['account.department'] = $('#department').val();
        data['account.job_no'] = $('#job_no').val();
        data['account.mobile'] = $('#mobile').val();
        data['oldPassword'] = $('#password').val();
        data['newPassword'] = $('#newPassword').val();
        data['account.email'] = $('#email').val();
        data['account.remark'] = $('#remark').val();
        $.ajax({
            url:"${gPath}/clmp/account/"+id,
            type:"post",
            cache:false,
            data:data,
            dataType:"json",
            success:function(data){
                if(data.status == 1){
                    $("#successMsg").show();
                }else{
                    if(data.msg){
                        $("#errorContent").html(data.msg);
                    }
                    $("#errorMsg").show();
                }
                $("#password").val("");
                $("#newPassword").val("");
                $("#reNewPassword").val("");
            },
            error:function(e){
                $("#errorMsg").show();
            }
        });
    }
    </script>
</body>
</html>